import React, { Component } from 'react';
import "../styles/Jingxuan.scss"
import * as service from "../api/index"
import { NavBar } from 'antd-mobile'

class Jingxuan extends Component {
    state = {
        jing: []
    }
    async componentDidMount() {
        //主页精选3张图
        var res1 = await service.index_xuan()
        console.log(res1.data);
        this.setState({ jing: res1.data })

    }

    render() {
        return (
            <div className='jingxuan'>
                <div className="top">
                    <NavBar onBack={() => { this.props.history.go(-1) }}><h3>精选景点</h3></NavBar>
                </div>
                <div className="xia">
                    <div className='top'>
                        <h4>本周精选</h4>
                        <p onClick={() => { this.props.history.push('/jingxuan') }}>查看更多</p>
                    </div>
                    <div className="xia">
                        {
                            this.state.jing.map((item, index) => {
                                return (
                                    <div className="xia_one" key={index}>
                                        <img src={item.img} alt="" />
                                        <p>{item.dizhi}</p>
                                        <p>{item.money}</p>
                                    </div>
                                )
                            })
                        }
                    </div>
                    <div className="xia">
                        {
                            this.state.jing.map((item, index) => {
                                return (
                                    <div className="xia_one" key={index}>
                                        <img src={item.img} alt="" />
                                        <p>{item.dizhi}</p>
                                        <p>{item.money}</p>
                                    </div>
                                )
                            })
                        }
                    </div>
                    <div className="xia">
                        {
                            this.state.jing.map((item, index) => {
                                return (
                                    <div className="xia_one" key={index}>
                                        <img src={item.img} alt="" />
                                        <p>{item.dizhi}</p>
                                        <p>{item.money}</p>
                                    </div>
                                )
                            })
                        }
                    </div>
                </div>

            </div>
        );
    }
}

export default Jingxuan;